import {Component, OnInit, Input, DoCheck, ViewChild} from '@angular/core';
import {Router} from "@angular/router";
import {LocalStorage} from "../../app.local-storage";
import {APARTMENT} from "../../service/apartment.service";
import {CONSTANT} from "../../service/constant.service";
import {TitleCpt} from "../../lib/title/title.component";
import {ROUTE} from "../../service/route.service";
import {USER} from "../../service/user.service";
import {LoginModalViewComponent} from "../login-modal-view/login-modal-view.component";
import {PaymentViewComponent} from "../payment-view/payment-view.component";
import {OnekeyRepairViewComponent} from "../onekey-repair-view/onekey-repair-view.component";
import {UserModel} from "../../model/user.model";
declare var $:any;

@Component({
  selector: 'app-home-view',
  templateUrl: './home-view.component.html',
  styleUrls: ['./home-view.component.scss']
})
export class HomeViewComponent implements OnInit,DoCheck {
  @ViewChild(LoginModalViewComponent) public loginModal:any;
  @ViewChild(PaymentViewComponent)public paymentModal:any;
  @ViewChild(OnekeyRepairViewComponent)public repairModal:any;
  showLoginModal:boolean=false;
  mulitSwiperOptions:any = {
    textBelowImg: true,
    multiNum: 3,
    imagePadding: 6
  };
  city:any;
  contents:any = [
    {
      content:'青果有意愿成为公寓服务领域的一流企业，以更专业、具有市场竞争力的公寓产品立足公寓服务领域，' +
      '为年轻人提供居住舒适、配套齐全、有家的氛围的公寓社区产品，成为社会尊重、员工满意、股东与客户价值最大化的企业。',
      imgUrl:'assets/images/ggq01.jpg'
    }
  ];
  projects:any=[];
  homeTitleCptList:Array<TitleCpt> = this.constant.genHomeTitleCptList()
  constructor(private apartment: APARTMENT,
              private constant:CONSTANT,
              private router: Router,
              private USER:USER,
              private ls:LocalStorage,private route:ROUTE) {
    // console.log(this.contents);
    this.city=this.ls.getObject('city');
    this.loadHomeProject();
    // $(function(){
    //   $(document).bind('scroll',function() {
    //     let ele = $('.qgy-service-container');
    //     let scrollTop:any = $(document).scrollTop()
    //     let top:any = ele.offset().top;
    //     let clientHeight:any = $(window).height();
    //     let isAnimate:boolean = (scrollTop+clientHeight-top) >30 && (scrollTop+clientHeight-top)< 100 ? true :false;
    //     if(isAnimate){
    //       console.log(ele);
    //        ele.attr('animated fadeInLeft');
    //     }else{
    //       ele.remove('animated fadeInLeft');
    //     }
    //   });
    // })
  }

  loadHomeProject(){
    let reqData = {
      page: 0,
      size: 6
    };
    this.apartment.getTopList(reqData, (message: any)=> {
      if (message.content.length > 0) {
        let list = [];
        for (let item of message.content) {
          let swiperData={
            id:item.id,
            img: item.thumb,
            title: item.name,
            content: item.brief
          };
          list.push(swiperData);
        }
        this.projects = list;
      }
    });
  }


  goProject(item:any){
    if(item && item.id){
      this.router.navigate([`project/${item.id}`]);
    }
  }

  goToStoryDetailView(){
    this.route.goStoryDetailView();
  }

  ngDoCheck(): void {
    let newCity=this.ls.getObject('city');
    if(newCity.code!=this.city.code){
      console.log('城市切换检测成功，新城市：',newCity.name);
      this.city=newCity;
      this.loadHomeProject();
    }
  }

  showPaymentModal(){
    if(this.user==null){
      this.showLoginModal = true;
    }else{
      this.paymentModal.showModal();
    }
  };
  closeLogin(result:Object){
    if(result instanceof UserModel){
      this.user=result;
      this.USER.update(result);
    }
    this.showLoginModal=false;
  }
  showRepairModal(){
    if(this.user==null){
      this.showLoginModal = true;
    }else{
      this.repairModal.showModal();
    }
  }
  ngOnInit() {
    this.user = this.USER.get() as UserModel;
  }
  user:UserModel;

}
